<template>
  <view class="explorationList">
    <navBar v-if="isShowCustomNavBar" :navbarData.sync="navbarData"></navBar>
    <view v-if="utoolsData">
      <!-- <view v-if="utoolsData && utoolsClassGoodsLists"  > -->
      <utools-parse id="utools-parse" page="category" @triggerComponent="onTriggerComponent" @setPanel="setPanel"
        :utools-data="utoolsData" @onAddCart="onAddCart"></utools-parse>
    </view>
    <view class="ios_safe_zone" v-if="isIos">
      <view class="ios_safe_zone_line"></view>
    </view>
  </view>
</template>

<script>
  import api from '@/api/api';
  import NavBar from '@/components/common/navbar';
  import {
    SEL_CLASS_CODE,
    SEL_ACTIVE_CODE,
    SYSTEM_INFO,
    USER_INFO,
    CUSTOMER_INFO,
    CUSTOMER_HOTFIX,
    CART_KEY,
    MERCHANT_INFO,
    USER_SPECICAL_INFO
  } from '@/utils/constant';
  export default {
    components: {
      navBar: NavBar,
    },
    data() {
      return {
        utoolsData: null,
        tabName: null,
        ofseTop: 0,
        // 组件所需的参数
        navbarData: {
          showCapsule: 1, //是否显示左上角图标   1表示显示    0表示不显示
          title: '', //导航栏 中间的标题
          newLogo: uni.getStorageInfoSync('storeLogo'),
          isTopFixed: false,
          hideHome: true
        },
        isIos: false,
        isShowCustomNavBar: true,
        navBarHeight: 0,
        shareImage: '',
        shareTitle: '',
        pagePath: '',
        pageQuery: '',
        pageCode: "explorationList"
      };
    },
    async onLoad(option = {}) {
      this.isIos = wx.getSystemInfoSync().system.includes('iOS') && wx.getSystemInfoSync()?.safeArea?.top > 20;
      this.utoolsData = await this.getHomeUtoolsData(option);
      this.init()
      this.getPageShareData();
    },
    methods: {
      /**
       * 查询分享数据
       * @param {Object} option
       */
      async getPageShareData(option) {
        try {
          const res = await this.$commonFunction.getShareinfoByCode(this.pageCode);
          this.shareImage = res.shareImage || "";
          this.shareTitle = res.shareTitle || "";
          this.pagePath = res.pagePath; //  当前页面路由
          this.pageQuery = res.pageQuery; //  当前页面url参数
        } catch (e) {}
      },
      init() {
        let systemInfo = uni.getSystemInfoSync();
        let rect = uni.getMenuButtonBoundingClientRect ? uni.getMenuButtonBoundingClientRect() : null; //胶囊按钮位置信息
        uni.getMenuButtonBoundingClientRect();
        let pixelRatio1 = 750 / wx.getSystemInfoSync().windowWidth;
        const tabsH = this.utoolsData.children[0].title.style.height
        const heightTab = tabsH * wx.getSystemInfoSync().windowWidth / 750
        this.navBarHeight = (function() {
          //导航栏高度
          let gap = rect.top - systemInfo.statusBarHeight; //动态计算每台手机状态栏到胶囊按钮间距
          return 2 * gap + rect.height + Math.floor(heightTab);
        })();
      },
      async getHomeUtoolsData(option) {
        let json = await api.getUtoolsJson({
          type: this.pageCode
        });
        return json.success && json?.data ? JSON.parse(json.data) : null
      },
      // 触发热区
      onTriggerComponent(option) {
        const {
          itemId,
          type,
          trackData = null,
          item
        } = option.detail.data;

        // 触发锚点
        if (type == 'anchorsClick') {
          if (trackData) {
            const _trackData = JSON.parse(trackData);
            if (_trackData.type === 'click') this.$commonSensors.lithaTrack.cTrack(_trackData.name, _trackData.data);
            if (_trackData.type == 'view') this.$commonSensors.lithaTrack.crTrack(_trackData.name, _trackData.data);
          }
          const filteredAnchorsData = this.utoolsData.children[0].children
            .map((child, index) => this.findAnchorData(child.children, itemId))
            // 过滤掉 undefined 值，只保留有数据的项
            .find(data => data !== undefined);
          if (filteredAnchorsData) {
            wx.pageScrollTo({
              selector: `#utools-parse >>> #${filteredAnchorsData.id}`,
              offsetTop: -this.navBarHeight, //计算导航栏的高度
              duration: 800,
              complete: () => {},
              fail: () => {},
              success: () => {}
            })
          }
        }
        if (trackData) {
          try {
            this.$commonUtoolsTrack.sensorsTracking(trackData);
            const _typeArr = ["itemClick", "addCartClick"];
            if (item && _typeArr.includes(type)) this.$commonUtoolsTrack.tencentYoushuTracking(item, type);
          } catch (e) {
            
          }
        }
      },
      findAnchorData(children, itemId) {
        return children.find(item => JSON.parse(itemId).name === item.name1);
      },
      //设置折叠------------------------
      setPanel(i) {},
      onShareAppMessage(res) {
        let that = this
        if (res.from === 'button') {} else {
          this.$EFSTracking.trackingAction('SHARE_CARD', res.from, {});
        }
        let imageUrl = this.shareImage;
        let path = this.pageQuery ? `/${this.pagePath}?${this.pageQuery}` : `/${this.pagePath}`;
        let title = this.shareTitle ? this.shareTitle : uni.getStorageSync('storeName') || 'THE MACALLAN EBOUTIQUE麦卡伦';
        this.$commonSensors.sensorsPageShare();
				this.$sr.setContext({ share_title: title });
        return this.$commonFunction.commonShare(res, title, path, imageUrl);
      },
      onShareTimeline() {
				let title = this.shareTitle ? this.shareTitle : uni.getStorageSync('storeName') || 'THE MACALLAN EBOUTIQUE麦卡伦';
				this.$sr.setContext({ share_title: title });
        return {
          title: this.shareTitle ? this.shareTitle : uni.getStorageSync('storeName') || 'THE MACALLAN EBOUTIQUE麦卡伦',
          query: this.pageQuery,
          imageUrl: this.shareImage
        };
      },

    }
  }
</script>

<style lang="less">
</style>
